body .main .header {
  padding: 0.5rem var(--h-margin);
  height: 100%;
  width: 240px;
  width: var(--side-width);
  border-right: var(--standard-border);
  position: fixed;
  overflow: auto;
  -ms-overflow-style: none;
  -moz-overflow-style: none;
  background-color: var(--bg);
  transition: background-color var(--duration) var(--curve), border-color var(--duration) var(--curve), filter var(--duration) var(--curve);
  scrollbar-width: none;
  font-size: 0.82rem;
}
body .main .header .inner .logo {
  max-width: 20rem;
}
body .main .header .inner .logo a {
  display: block;
  transition: var(--transition);
  text-align: center;
}
body .main .header .inner .logo a img {
  width: calc(var(--side-width) * 0.8);
  height: calc(var(--side-width) * 0.8);
  max-width: 100%;
  vertical-align: middle;
  aspect-ratio: 1/1;
  transition: var(--transition-out);
  image-rendering: -webkit-optimize-contrast;
}
body .main .header .inner .logo a img:hover {
  transform: scale(1.2, 1.2);
}
body .main .header .inner .tagline {
  font-weight: var(--bold-weight);
  line-height: 1.5;
  text-align: left;
  margin: 0 auto 2rem;
}
body .main .content {
  animation: slowShow calc(2 * var(--duration)) var(--curve) both;
  margin-left: 240px;
  margin-left: var(--side-width);
  padding: var(--h-margin) var(--h-margin) 0;
}
